<template>
	<view class="task-wrap">
		<view class="scroll-wrap" style="position: relative;">
			<view class="tabContainer" style="margin-bottom: 120px;">
				<!-- 样品列表 -->
				<view class="sample-term-wrap">
					<view class="top_head" style="">
						<template>
							<u-form :model="form" ref="uForm" >
								<u-form-item label="天数" label-width="170" prop="dayCount" >
									<u-input v-model="form.dayCount" type="number" placeholder="请输入天数" />
								</u-form-item>
								<u-form-item label="频次(次/天)" label-width="170" prop="frequency">
									<u-input :disabled='isNoise' v-model="form.frequency" type="number" placeholder="请输入频次(次/天)" />
								</u-form-item>


								<u-form-item label="检测位置" label-width="170" v-for="(item,index) in addressNum">
									<view class="center_between" style="width: 100%;">
										<!-- <view class="" style="color: #2f3a89;">{{item}} #</view> -->
										
										<u-input v-model="item.val" placeholder="请输入检测位置"/>
										<uni-icons @click="delAddress(index)" v-if="index > 0" type="minus-filled" size="26"
											color='#2f3a89' />
									</view>
								</u-form-item>

								<u-form-item label="样品总数" label-width="170">
									<input v-model="factorNum" readonly type="number" />
								</u-form-item>
								<u-form-item label="是否分包" label-width="170">
									<u-switch slot="right" @change="switchChange(form.fbFlag)" size='35' v-model="form.fbFlag" active-color="#2f3a87"
										inactive-color="#e5e5e5" active-value="1" inactive-value="0"></u-switch>
								</u-form-item>

								<u-form-item label="分包机构" label-width="170" prop="organName" v-if="form.fbFlag">
									<u-input v-model="form.organName" type="select" placeholder="请选择分包机构"
										@click="show = true" />
									<u-action-sheet :list="actionSheetList" v-model="show" @click="actionSheetCallback">
									</u-action-sheet>
								</u-form-item>

							</u-form>
						</template>

						<view class="addAddress" @click="addAddress">
							<u-icon name="plus" />
							<view style="margin-left: 6px;font-size: 13px;">新增位置</view>
						</view>
					</view>


					<view style="display: flex;justify-content: space-between;">
						<view class="sample-term" style="flex: 1;margin-right: 20px;text-align: center;"
							@click="addFactor">
							<b style="color: #193566;font-weight: 700;">新增因子</b>
						</view>
						<!-- <view class="sample-term" style="flex: 1;text-align: center;" @click="addFactorCombination">
							<b style="color: #193566;">新增同系因子套餐</b>
						</view> -->
						<view class="sample-term" style="flex: 1;text-align: center;" @click="addFactorCombination">
							<b style="color: #193566;font-weight: 700;">新增同系因子套餐</b>
						</view>
					</view>

					<view class="sample-term" style="position: relative;" @click="detail"
						v-for="(item,index) in factorData" :key="index">
						<view class="" v-if="item.isFactor == 0">
						<!-- <template v-if="item.isFactor == 0"> -->
						<view class="center_between">
							<b style="width: 80px;">检测因子</b>
							<view class="content center_between">
								<b class="content" style="margin-right: 10px;text-align: left;color: #193566;">
									{{item.factorName}}
								</b>
							</view>
						</view>
						<view class="center_between" style="margin: 8px 0;">
							<view style="width: 80px;font-size: 12px;">标准号</view>
							<view class="content center_between">
								<view class="content" style="margin-right: 10px;text-align: left;">
									{{item.standardNo}}
								</view>
							</view>
						</view>
						<view class="center_between" style="margin:0 0 8px 0;">
							<view style="width: 80px;font-size: 12px;">标准名称</view>
							<view class="content center_between">
								<view class="content" style="margin-right: 10px;text-align: left;">
									{{item.standardName}}
								</view>
							</view>
						</view>
						<view class="center_between">
							<view style="width: 80px;font-size: 12px;">分析方法</view>
							<view class="content center_between">
								<view class="content" style="margin-right: 10px;text-align: left;">
									{{item.analysisMethod}}
								</view>
							</view>
						</view>
						</view>
						
						<view class="" v-else>
							<view class="center_between" style="margin: 8px 0;">
								<b style="width: 80px;font-size: 12px;font-weight: 700;">套餐名称</b>
								<view class="content center_between">
									<view class="content"
										style="margin-right: 10px;text-align: left;font-weight: 700;color: #193566;">
										{{item.factorName}}
									</view>
								</view>
							</view>
						
							<view class="center_between" style="margin: 8px 0;">
								<view style="width: 80px;font-size: 12px;">检测因子</view>
								<view class="content center_between">
									<view class="content" style="margin-right: 10px;text-align: left;">
										{{item.name.toString()}}
									</view>
								</view>
							</view>
						</view>

						<view class="nav_btn">
							<button style="color:#fff" class="dialogBtn navSingleBtn"
								@click="del(item,index)">删除
							</button>
						</view>
					
						
						<!-- </template> -->
						
						
					</view>


				</view>
			</view>

			<view class="footerBtn" style="display: flex;">
				<view class="btn footerBtn footerBtns">
					<view style="padding:0 10px;flex: 1;">
						<button class="rightTabsBtn rightTabsSingleBtn" type="primary" @click="commit"
							style="color: #fff;" :ripple="true" :loading="commitLoading">提交</button>
					</view>

				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import sampleFactor from '@/components/sample/sample-factor.vue'
	export default {
		components: {
			sampleFactor,
		},
		data() {
			return {
				keyword: '',
				errorType: 'message',
				addressNum: [{
					val:''
				}],
				isNoise:false,
				address:'',
				show: false,
				border: true,
				actionSheetList: [],
				isEgManage: false,
				checkboxVisible: true,
				commitLoading: false,
				taskId: '',

				factorData: [],
				sampleTaskInfo: {
					projectName: '',
					consignorName: '',
					inspectionName: '',
					sampleCount: '',
					jobId: '',
					inspectionLinker: '',
					singImageUrl: '',
					sampleVos: [],
				},
				form: {
					dayCount: '1',
					frequency: '1',
					factorPoint: '1',
					fbFlag: false,
					organName: '',
					organId:''
				},
				rules: {
					dayCount: [{
						required: true,
						message: '请输入天数'
					}],
					frequency: [{
						required: true,
						message: '请输入频次(次/天)'
					}],
					organName: [{
						required: true,
						message: '请选择分包机构'
					}]
				}
			}
		},
		computed: {
			factorNum: function() {
				return this.form.dayCount * this.form.frequency * this.addressNum.length
			}

		},
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		onLoad(e) {
			if (e.taskId) {
				this.taskId = e.taskId
			}
		},
		onShow() {
			this.getSampleVos()
			uni.$once('query', (query) => {
				let data = [...this.factorData, ...query.paramsName]
				let map = new Map();
				for (let item of data) {
					if (!map.has(item.checkStandardId)) {
						map.set(item.checkStandardId, item);
					};
				};
				this.factorData = [...map.values()];
				//判断是否为噪音 频次只能为1
				this.isNoise = false
				this.factorData.map((item)=>{
					if(item.isNoise == true) this.isNoise = true
				})
				console.log(this.factorData,'this.factorData');
			});
			uni.$once('queryCombination', (query) => {
				let data = [...this.factorData, ...query.factor]
				let map = new Map();
				for (let item of data) {
					if (!map.has(item.standardCode)) {
						map.set(item.standardCode, item);
					};
				};
				this.factorData = [...map.values()];
				console.log(this.factorData,'this.factorData');
			});
			
			let _this = this
			uni.$on('edit_querys', (query) => {
				let data = [...this.factorData, ...query.params]
				let map = new Map();
				for (let item of data) {
					if (!map.has(item.standardCode)) {
						map.set(item.standardCode, item);
					};
				};
				this.factorData = [...map.values()];
			});
			
			
		},
		methods: {
			switchChange(e){
				if(e == false){
					this.form.fbFlag=0,
					this.form.organName='',
					this.form.organId=''
				}
			},
			// 点击actionSheet回调
			actionSheetCallback(index) {
				console.log(this.actionSheetList[index]);
				this.form.organId = this.actionSheetList[index].id;
				this.form.organName = this.actionSheetList[index].judgeOrganName
			},
			//新增位置
			addAddress() {
				this.addressNum.push({val:''})
			},
			//删除位置
			delAddress(index) {
				this.addressNum.splice(index, 1)
			},
			//新增因子
			addFactor() {
				console.log('新增因子');
				this.$common.navigateTo('/pages/sampleLeader/opt/factorOpt/addFactor?source=' + 'addFactor');
			},
			//新增同系因子套餐
			addFactorCombination() {
				console.log('新增同系因子套餐');
				this.$common.navigateTo('/pages/sampleLeader/opt/factorOpt/addFactorCombination');
			},
			commit() {
				this.commitLoading = true
				if(!this.addressNum[0].val) {
					uni.showToast({
					title: '请输入检测位置',
					icon:'none',
					duration: 2000
					});
					this.commitLoading = false		
					return
				}
				if(this.factorData.length == 0 ) {
					uni.showToast({
					title: '请添加因子',
					icon:'none',
					duration: 2000
					});
					this.commitLoading = false		
					return
				}
				
				let factorPoint = []
				this.addressNum.map((item)=>{
					factorPoint.push(item.val)
				})
				let subCheckStandardIds = []
				this.factorData.map((item)=>{
					item.dataEntryStep = 1
				})
				
				let arr = []
				let params = {
					dayCount: this.form.dayCount,
					frequency: this.form.frequency,
					fbFlag: this.form.fbFlag?0:1,
					organName: this.form.organName,
					organId:this.form.organId,
					sampTaskId: this.taskId,
					secdClassId: this.factorData[0].secdClassId,
					secdClassName:this.factorData[0].secdClassName,
					factorPoint:factorPoint.toString(),
					factorTdos:this.factorData,
					factorGroupKey:'5666',
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						this.$api.commonForPost('sample/addSample', params, res => {
						    if (res.code === 200) {
						        uni.showToast({
						        	title: '提交成功，数据审核中...',
									icon:'none',
						        	duration: 2000
						        	});
								setTimeout(()=>{uni.navigateBack({
									                delta: 1
									              })
								this.commitLoading = false}, 2000);
						    }else{
								uni.showToast({
								title: res.message,
								icon:'none',
								duration: 2000
								});
								this.commitLoading = false
							}
						})
					} else {
						console.log('验证失败');
					}
				});
			},
			// //详情
			// detail() {
			// 	console.log('详情');
			// },
			//删除
			del(item, index) {
				this.factorData.splice(index, 1)
				//判断是否为噪音 频次只能为1
				this.isNoise = false
				this.factorData.map((item)=>{
					if(item.isNoise == true) this.isNoise = true
				})
				console.log(this.factorData, index, item);
			},
			// 获取分包机构
			getSampleVos() {
				this.$api.commonForGet('common/findValidList', res => {
					this.actionSheetList = res.result
					this.actionSheetList.map((item) => {
						item.text = item.judgeOrganName
					})
					console.log(this.actionSheetList);
				})
			},
			// //打开批量操作弹出按钮框
			// openDialogBtns() {
			// 	this.dialogBtns_hidden = true
			// },
			// //修改
			// modify() {
			// 	this.$common.navigateTo('/pages/sampleLeader/opt/batchModifyCommit?taskId=' + this.taskId);
			// },
			goToHandWriting(sampItemId) {
				this.$common.navigateTo('/pages/handWriting/index?sampItemId=' + sampItemId);
			},
			// toEgManage() {
			// 	uni.setNavigationBarTitle({
			// 		title: '样品管理'
			// 	})
			// 	this.hidden = true
			// 	this.isEgManage = true

			// }
		}
	}
</script>

<style scoped>
	uni-page-body {
		height: 100%;
	}

	.task-wrap {
		background: #F0F2FA;
		height: 100vh;
		display: flex;
		flex-direction: column;

	}

	.project-info {
		height: 280rpx;
		width: calc(100%-98rpx);
		background-color: #D6D8DF;
		padding-left: 49rpx;
		padding-right: 49rpx;
	}

	.sample-detail {
		margin-top: 20rpx;
		font-size: 25rpx;
		height: 32rpx;
		display: flex;
		align-items: center;

	}

	.sample-detail .title {
		color: #193566;
		font-weight: bolder;
		opacity: 0.8;
		display: inline-block;
		width: 140rpx;
		text-align: right;
	}

	.sample-detail .value {
		color: #193566;
		font-weight: 400;
		opacity: 0.7;
		width: 65%;
		display: inline-block;
		padding-left: 5%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		display: inline-block;
	}

	.scroll-wrap {
		flex: 1;
		overflow: scroll;
		padding-bottom: 50rpx;
	}

	.tabContainer {
		height: auto;
	}

	.signature {
		position: absolute;
		top: 0;
		right: 0;
		width: 167rpx;
		height: 61rpx;
		color: #fff;
		background-color: #193566;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 25rpx;
	}

	.signatureImg image {
		position: absolute;
		top: 0;
		right: 0;
		width: 61rpx;
		height: 61rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 25rpx;
	}

	.footerBtn {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
	}

	.btn {
		border-radius: 0;
		width: 100%;
		background: #2f3a89;
	}

	.footerBtns {
		display: flex;
		background: #d2dcf8;
		padding: 10rpx 0;
		box-shadow: -1px 0 1px #ccc;
	}

	.dialogBtns {
		position: absolute;
		top: -180rpx;
		left: 0;
		padding: 10rpx 20rpx;
		background: #d2dcf8;
		width: 100%;
		box-shadow: 1px 0px 1px #ccc;
		padding-top: 20rpx;
	}

	.dialogBtn {
		border: 1px solid #eee;
		margin-bottom: 10rpx;
		width: 100%;
		padding: 0;
		font-size: 14px;
		height: 60rpx;
		color: #2f3a89;
		background: #ffda94;
	}

	.leftTabsBtn {
		width: 100%;
		border: 1px solid #eee;
		height: 60rpx;
		font-size: 14px;
		color: #2f3a89;
		background: #ffda94;
	}

	.rightTabsBtn {
		height: 60rpx;
		font-size: 14px;
		background: #2f3a89;
	}

	.rightTabsSingleBtn {
		width: 50%;
		color: #2f3a89;
		height: 60rpx;
		font-size: 14px;
		box-shadow: 1px 1px 3px #ccc;
	}

	.center_between {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.top_head {
		margin-top: 8px;
		border-radius: 8px;
		background: #fff;
		overflow: hidden;
	}

	.top_head_nav {
		display: flex;
		justify-content: space-between;
		align-items: center;

	}

	.content {
		flex: 1;
		text-align: right;
		color: #68696d;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.sample-term-wrap {
		width: calc(100%-70rpx);
		display: flex;
		justify-content: center;
		flex-direction: column;
		/* align-items: center; */
		padding-left: 35rpx;
		padding-right: 35rpx;
	}

	.sample-term {
		/* width: 90%; */
		/* min-height:390rpx; */
		/* height:370rpx; */
		border-radius: 16rpx;
		background: #fff;
		padding: 20rpx;
		box-shadow: 0px 3px 3px 1px rgba(0, 0, 0, 0.16);
		margin-top: 20rpx;
	}

	.nav_btn {
		position: absolute;
		top: 16rpx;
		right: 16rpx;
		z-index: 0;
	}

	.navSingleBtn {
		font-size: 12px;
		padding: 0 8px;
		background: #2f3a89;
		box-shadow: 1px 1px 1px #ccc;
	}

	/deep/ .u-form-item {
		padding: 6px 16px!important;
		line-height: 26px!important;
		font-size: 13px!important;
	}

	.addAddress {
		display: flex;
		justify-content: center;
		padding: 5px;
		color: #fff;
		background: #2f3a89;
	}
</style>
